<h1 class="page-header">
    <small>新增后台管理员</small>
</h1>
<hr/>
<div class="panel panel-inverse" data-sortable-id="form-stuff-1">
    <div class="panel-heading">
        <h4 class="panel-title">管理员信息</h4>
    </div>
    <div class="panel-body">
        <form class="form-horizontal" id="accountForm" name="accountForm" action="" method="post">
            <div class="form-group">
                <label class="col-md-3 control-label">用户名</label>
                <div class="col-md-3">
                    <input type="text" id="accountName" class="form-control" name="accountName" placeholder="用户名 4-20位" rangelength="4,20" required>
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">关联店铺员工</label>
                <div class="col-md-5">
                    <div class="fl" id="staffNameDiv">
                        <input type="hidden" id="staffId" name="staffId" placeholder="关联店铺员工" value="${account.staffId}">
                    </div>
                    <div class="tips fl" style="padding-top: 3px;"><a onclick="selectStaff();" class="btn btn-success btn-icon btn-circle"><i class="fa fa-user"></i></a>选择店铺员工</div>
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">真实姓名</label>
                <div class="col-md-3">
                    <input type="text" id="realName" class="form-control" name="realName" placeholder="真实姓名 最长20位" maxlength="20" >
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">登录密码</label>
                <div class="col-md-3">
                    <input type="password" id="password" class="form-control" name="password" value="" placeholder="密码 6-20位" rangelength="6,20" required>
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">确认密码</label>
                <div class="col-md-3">
                    <input type="password" id="confirmPassword" class="form-control" name="confirmPassword" value="" placeholder="密码 6-20位" rangelength="6,20" required>
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-md-3">管辖店铺</label>
                <div class="col-md-2" id="storeNameDiv">
                    <input name="storeId" type="hidden" value="0">
                    <input name="storeName" type="hidden" value="">
                    <span class="label label-danger f-s-14 m-t-5" style="display: inline-block;font-size:12px;padding:5px;">未设置</span>
                </div>
                <div class="col-md-2">
                    <a id="storeSearch" class="btn btn-success btn-icon btn-circle" onclick="selectStore('storeName')" title="店铺查询"><i class="fa fa-plus"></i></a>店铺查询
                </div>
            </div>

            <div class="form-group">
                <label class="col-md-3 control-label">分配角色</label>
                <div class="col-md-9">
                    <@sp.tree actionUrl="${rc.contextPath}/duty/tree" title="分配角色" selected=""/>
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label"></label>
                <div class="col-md-9">
                    <button type="button" id="submitButton" class="btn btn-sm btn-success">提交</button>
                    <button type="button" class="btn btn-sm btn-danger"
                            onclick="getData('${rc.contextPath}/user/query','displayArea')">返回
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>
<script type="application/javascript">

    $(function () {
        $('#submitButton').click(function () {
            $('#accountForm').submit();
        })

        $('#accountForm').validate({
            rules: {
                accountName: {
                    accountCheck: true,
                    byteRangeLength: [2, 20]
                },
                confirmPassword: {
                    equalTo: "#password"
                },
                storeId: {
                    require: true
                }
            },
            messages: {
                accountName: {
                    rangelength: "长度为2-20的字母\\数字\\下划线"
                },
                storeId: {
                    require: "管辖店铺必须选择"
                }
            },
            errorPlacement: function (error, element) {
                error.appendTo(element.parent());
            },
            submitHandler: function () {
                var selectNode = $.selectedTreeNode();
                postDataByFormParams('${rc.contextPath}/user/add', 'displayArea', 'accountForm', selectNode);
            }
        })
    });

    /**
     * 查询店铺
     * @param name
     */
    function selectStore(name) {
        alterpage('${rc.contextPath}/backend/store/quickSearchInit/?name='+name, "店铺查询");
    }

    /**
     * 选择员工
     * @param name
     */
    function selectStaff() {
        alterpage('${rc.contextPath}/backend/staff/quickSearch/', "选择店铺员工");
    }
</script>

